<template>
  <div style="padding-bottom: 80px">
    <a-spin :spinning="spinning">
      <top-nav-bar :applyPageRoute="nowRouteTitle" @back="back"></top-nav-bar>
      <a-card :bordered="false" :bodyStyle="{ padding: '24px 16px', height: '100%' }">
        <a-row :gutter="48">
          <a-form-model
            layout="inline"
            labelAlign="right"
            :model="form"
            ref="ruleF"
            :rules="ruleForm"
            :labelCol="{ span: 4 }"
            :wrapperCol="{ span: 18 }"
          >
            <a-col :md="8" :sm="24">
              <a-form-model-item label="上课日期" style="width: 100%; height: 48px" prop="attend_class_day">
                <!-- :labelCol -->
                <a-date-picker v-model="form.attend_class_day" :allowClear="false" @change="changeDate" />
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="24">
              <a-form-model-item label="授课课程" style="width: 100%; height: 48px">
                <!-- :labelCol -->
                {{ form.course_name || '--' }}
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="24">
              <a-form-model-item label="上课教室" style="width: 100%; height: 48px">
                <!-- :labelCol -->
                <a-select placeholder="请选择上课教室" style="width: 200px" v-model="form.classroom_id">
                  <a-select-option :value="null">不指定</a-select-option>
                  <a-select-option v-for="(item, index) in classRoomSelect" :key="index" :value="item.id">{{
                    item.name
                  }}</a-select-option>
                </a-select>
                <a href="javascript:;" @click="showClassroom()" style="margin-left: 10px">设置</a>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="24">
              <a-form-model-item label="上课时间" class="orderNameVueClass_time" style>
                <a-time-picker v-model="form.class_start_time" format="HH:mm" @change="changeEndTime" />~
                <a-time-picker
                  v-model="form.class_end_time"
                  :disabled-hours="disabledHours"
                  :disabled-minutes="disabledMinutes"
                  :disabled="!form.class_start_time"
                  format="HH:mm"
                  @change="changeEndTime"
                />
                <!-- :labelCol -->
                <!-- <a-select
                  placeholder="请选择上课时间"
                  style="width: 200px"
                  allowClear
                  v-model="form.class_time_id"
                >
                  <a-select-option
                    v-for="(item,index) in classTimeSelect"
                    :key="index"
                    :value="item.id"
                  >{{item.start_time}}&nbsp;~&nbsp;{{item.end_time}}</a-select-option>
                </a-select>-->
                <!-- <a @click="showChild('classTime')" style="margin-left:10px;">设置</a> -->
              </a-form-model-item>
            </a-col>

            <a-col :md="8" :sm="24">
              <a-form-model-item label="授课课时" style="width: 100%; height: 48px" prop="teaching_hours">
                <!-- :labelCol -->
                <a-input-number id="inputNumber" v-model="form.teaching_hours" :min="0" />
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="24">
              <a-form-model-item label="上课老师" style="width: 100%; height: 48px" prop="teacher_ids">
                <!-- :labelCol -->
                <a-select
                  placeholder="请选择上课老师"
                  style="width: 200px"
                  allowClear
                  v-model="form.teacher_ids"
                  mode="multiple"
                >
                  <a-select-option v-for="(item, index) in teacherList" :key="index" :value="item.id">{{
                    item.name
                  }}</a-select-option>
                </a-select>
              </a-form-model-item>
            </a-col>
            <a-col :md="8" :sm="24">
              <a-form-model-item label="上课内容" style="width: 100%; height: 48px">
                <a-input
                  v-model="form.content"
                  style="width: 400px"
                  :maxLength="20"
                  placeholder="请输入上课内容（20字内）"
                />
              </a-form-model-item>
            </a-col>
          </a-form-model>
        </a-row>
        <classroom-components ref="classRoom" @reload="getSelect"></classroom-components>
      </a-card>
      <a-card :bordered="false" :bodyStyle="{ padding: '24px 16px', marginTop: '20px', height: '100%' }">
        <div class="btns" v-if="!is_1v1">
          <a-button size="small" style="margin-right: 20px" @click="openLs" v-if="!is_1v1"
            >添加临时学员</a-button
          >
          <a-button size="small" v-if="!is_1v1" @click="showBukeStudent = true">添加补课学员</a-button>
        </div>
        <a-table
          :columns="columns"
          :data-source="data"
          class="user_management_table"
          style="border: 1px solid #e8e8e8"
          :pagination="false"
        >
          <span slot="name" slot-scope="text, record">
            <div>
              <a-tag color="blue" style="margin-right: 0" v-if="record.student_type == 3">试听</a-tag>
              <a-tag color="blue" style="margin-right: 0" v-if="record.student_type == 1">临时</a-tag>
              <a-tag color="blue" style="margin-right: 0" v-if="record.student_type == 2">调课</a-tag>
              {{ record.name }}
            </div>
            <div>{{ record.main_phone }}</div>
          </span>
          <span slot="reduce">{{ form.course_name }}</span>
          <span slot="deduction" slot-scope="text, record">
            <span v-if="record.deductible && record.deductible.type == 'refuse'">按天自动消耗</span>
            <span v-else-if="record.deductible && record.deductible.type == 'day'">按天自动消耗</span>
            <span v-else-if="record.deductible && record.deductible.type == 'super'">按天自动消耗</span>
            <span v-else-if="record.pivot_id && +Number(record.student_type) == 3">试听学员不扣课时</span>
            <span v-else>
              <a-input-number
                :disabled="record.call_student_id"
                v-model="record.teaching_hours"
                style="width: 100px"
                @change="$forceUpdate()"
                :min="0"
              />

              <!-- onkeyup="this.value=this.value.replace(/^\d+(\.\d+)?$/g,'')" -->
            </span>
          </span>
          <span slot="deductionTitle">
            扣课时
            <a-tooltip placement="top">
              <template slot="title">
                <span>补课学员实扣课时为应扣课时减去已扣课时，且不可修改</span>
              </template>
              <a-icon type="question-circle" />
            </a-tooltip>
          </span>

          <span slot="remarks" slot-scope="text, record">
            <a-textarea
              v-model="record.remarks"
              placeholder="请输入(选填,最多输入100个字符)"
              :max-length="100"
              @change="$forceUpdate()"
            ></a-textarea>
          </span>
          <span slot="surplus_clas_hour" slot-scope="text, record">
            <span v-if="record.deductible">
              <span v-if="record.deductible.type == 'hour'">
                {{ record.deductible.allowance }}课时
                <span v-if="record.hour_due_time && courseCalidity" style="color: rgb(236, 75, 53)">
                  (已于{{ record.hour_due_time }}到期)
                </span>
              </span>
              <span v-else-if="record.deductible.type == 'day'">{{ record.deductible.allowance }}天</span>
              <span v-else-if="record.deductible.type == 'super'">{{ record.deductible.allowance }}天(已超上)</span>
              <span v-else-if="record.deductible.type == 'refuse'">{{ record.deductible.allowance }}天</span>
            </span>
            <span v-else>-</span>
          </span>
          <span slot="type" slot-scope="text, record, index">
            <span v-if="record.deductible && record.deductible.type !== 'refuse'">
              <a-radio-group
                v-model="record.type"
                size="small"
                button-style="solid"
                @change="changeType(record, index)"
              >
                <a-radio-button :value="1">到课</a-radio-button>
                <a-radio-button :value="2">迟到</a-radio-button>
                <a-radio-button :value="3">请假</a-radio-button>
                <a-radio-button :value="4">未到</a-radio-button>
              </a-radio-group>
            </span>
            <span v-else>
              <a-tooltip>
                <template slot="title">课程未开始不能点名，请移除该学生</template>
                <a-radio-group size="small" button-style="solid" disabled>
                  <a-radio-button :value="1">到课</a-radio-button>
                  <a-radio-button :value="2">迟到</a-radio-button>
                  <a-radio-button :value="3">请假</a-radio-button>
                  <a-radio-button :value="4">未到</a-radio-button>
                </a-radio-group>
              </a-tooltip>
            </span>
          </span>
          <span slot="action" slot-scope="text, record">
            <a @click="reduceStudent(record)">移出课次</a>
          </span>
        </a-table>
        <a-modal
          @ok="addStudentToData('linshi')"
          @cancel="showStudent = false"
          title="临时学员列表"
          width="720px"
          :visible="showStudent"
        >
          <a-input
            style="width: 280px; margin-bottom: 10px"
            v-model="keywords"
            placeholder="请输入学员姓名/手机号(回车搜索)"
            @pressEnter="getTemporaryStudent()"
          >
            <a-tooltip slot="suffix" title="搜索学生姓名/手机号">
              <a-icon type="search" style="color: rgba(0, 0, 0, 0.45)" @click="getTemporaryStudent()" />
            </a-tooltip>
          </a-input>
          <!-- <s-table
            ref="table"
            :columns="temporaryColumns"
            :data="loadData"
            class="user_management_table"
            :scroll="{ y: 300 }"
            :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
          >
            <span slot="name" slot-scope="text, record">{{ record.name }}</span>
            <span slot="phone" slot-scope="text, record">{{ record.main_phone }}</span>

            <span slot="courseName" slot-scope="text, record">{{ record.course_name }}</span>
            <span slot="remain" slot-scope="text, record">
              <span v-if="record.surplus_clas_hour">
                <span v-if="record.surplus_clas_hour.hour || Number(record.surplus_clas_hour.hour) == 0"
                  >{{ record.surplus_clas_hour.hour }}课时</span
                >
                <span v-if="record.surplus_clas_hour.day || Number(record.surplus_clas_hour.day) == 0">
                  <span v-if="record.surplus_clas_hour.hour || Number(record.surplus_clas_hour.hour) == 0">/</span>
                  {{ record.surplus_clas_hour.day }}天
                </span>
              </span>
              <span v-else>--</span>
            </span>
          </s-table> -->
          <a-table
            :columns="temporaryColumns"
            :data-source="loadData"
            ref="table"
            class="user_management_table"
            :scroll="{ y: 300 }"
            rowKey="id"
            :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
            style="border:1px solid #e8e8e8;"
            :pagination="false"
            :loading="loading"
          >
            <span slot="name" slot-scope="text, record">{{ record.name }}</span>
            <span slot="phone" slot-scope="text, record">{{ record.main_phone }}</span>

            <span slot="courseName" slot-scope="text, record">{{ record.course_name }}</span>
            <span slot="remain" slot-scope="text, record">
              <span v-if="record.surplus_clas_hour">
                <span v-if="record.surplus_clas_hour.hour || Number(record.surplus_clas_hour.hour) == 0"
                  >{{ record.surplus_clas_hour.hour }}课时</span
                >
                <span v-if="record.surplus_clas_hour.day || Number(record.surplus_clas_hour.day) == 0">
                  <span v-if="record.surplus_clas_hour.hour || Number(record.surplus_clas_hour.hour) == 0">/</span>
                  {{ record.surplus_clas_hour.day }}天
                </span>
              </span>
              <span v-else>--</span>
            </span>
          </a-table>
          <div style="margin-top:10px;    text-align: right;margin-right:5px;">
             <a-pagination  :total="total" v-model="pageNo" @change="changePage"/>
          </div>
        </a-modal>
        <a-modal
          @ok="addBukeStudentToData('buke')"
          @cancel="showBukeStudent = false"
          title="补课学员列表"
          width="1200px"
          :visible="showBukeStudent"
        >
          <a-input
            style="width: 280px; margin-bottom: 10px"
            v-model="bukeKeywords"
            placeholder="请输入学员姓名/手机号(回车搜索)"
            @pressEnter="getTemporaryStudent()"
          >
            <a-tooltip slot="suffix" title="搜索学生姓名/手机号">
              <a-icon type="search" style="color: rgba(0, 0, 0, 0.45)" @click="$refs.bukeTable.refresh()" />
            </a-tooltip>
          </a-input>
          <s-table
            ref="bukeTable"
            :columns="bukeColumns"
            :data="bukeData"
            :rowSelection="{ selectedRowKeys: selectedBukeRowKeys, onChange: onSelectBukeChange }"
            class="user_management_table"
            :scroll="{ y: 300 }"
          >
            <span slot="name" slot-scope="text, record">
              <span v-if="record.student">
                <a-tag color="blue" style="margin-right: 0" v-if="record.student_type == 3">试听</a-tag>
                <a-tag color="blue" style="margin-right: 0" v-if="record.student_type == 1">临时</a-tag>
                <a-tag color="blue" style="margin-right: 0" v-if="record.student_type == 2">调课</a-tag>
                <span :title="record.student.name">{{ record.student.name }}</span>
              </span>
            </span>
            <span slot="className" slot-scope="text, record">
              <span>{{ record.class_name }}</span>
            </span>
            <span slot="classTime" slot-scope="text, record">
              <span v-if="record.record"
                >{{ record.record.attend_class_day }}&nbsp;{{ record.record.start_time }}-{{
                  record.record.end_time
                }}</span
              >
            </span>
            <span slot="shouldClassTime" slot-scope="text, record">
              <span v-if="record.consume_type == 1">{{ record.class_hour }}</span>
              <span v-if="record.consume_type == 2">按天自动扣课时</span>
            </span>
            <span slot="comeType" slot-scope="text, record">
              <span v-if="record.type">{{
                record.type == 2 ? '迟到' : record.type == 3 ? '请假' : record.type == 4 ? '未到' : ''
              }}</span>
            </span>
            <span slot="costCourse" slot-scope="text, record">
              <span v-if="record.course">{{ record.course.name }}</span>
            </span>
          </s-table>
        </a-modal>
      </a-card>
      <a-card class="footer" :bodyStyle="{ padding: '6px 16px 12px', marginTop: '10px', height: '100%' }">
        <span class="marginRight">
          <span>到课{{ count.come }}人</span>
          <span>迟到{{ count.late }}人</span>
          <span>请假{{ count.leave }}人</span>
          <span>未到{{ count.noCome }}人</span>
        </span>
        <a-button type="primary" style="margin-right: 20px" @click="submit('ruleF')">完成点名</a-button>
      </a-card>
    </a-spin>
  </div>
</template>

<script>
import topNavBar from '@/components/topNavBar/topNavBar'
import { classTimeList } from '@/api/classTime'
import { classroomList } from '@/api/classroom'
import { teacherList } from '@/api/teacher'
import DetailList from '@/components/tools/DetailList'
import classroomComponents from '@/components/classroomManage'
import { classInfo, studentInClassAwait, createRollCall, ruleData, defaultCallStudent } from '@/api/class'
import { missLessonList, missClassStudentsList } from '@/api/missLesson'
import { STable } from '@/components'
import { addLinshiStudentList, makeToken } from '@/api/takeName'
import { lessonInfo } from '@/api/lessonTable'
import moment from 'moment'
import { getHiddenStudentInfo, getCourseInfo } from '@/api/config'
const DetailListItem = DetailList.Item
export default {
  components: {
    DetailList,
    DetailListItem,
    // classTime,
    topNavBar,
    classroomComponents,
    STable,
  },
  data() {
    return {
      courseCalidity: false,
      qingjia: false,
      weidao: false,
      spinning: false,
      is_1v1: false,
      count: {
        come: 0,
        late: 0,
        leave: 0,
        noCome: 0,
      },
      nowRouteTitle: '',
      classTimeSelect: [],
      classRoomSelect: [],
      teacherList: [],
      form: {
        timePick: null,
        attend_class_day: null,
        content: '',
        classroom_id: null,
        teacher_ids: [],
        teaching_hours: null,
      },
      ruleForm: {
        // attend_class_day:[{}]
        attend_class_day: [{ required: true, message: '请选择上课日期' }],
        teacher_ids: [{ required: true, message: '请选择上课教师', trigger: 'change' }],
        teaching_hours: [{ required: true, message: '请输入授课课时', trigger: 'blur' }],
      },
      no_come_cut_hour: 1, //未到状态
      columns: [
        {
          title: '姓名',
          dataIndex: 'name',
          scopedSlots: { customRender: 'name' },
        },
        {
          title: '消耗课程',
          dataIndex: 'reduce',
          ellipsis: true,
          scopedSlots: { customRender: 'reduce' },
        },
        {
          title: '剩余课时/天数',
          dataIndex: 'surplus_clas_hour',
          scopedSlots: { customRender: 'surplus_clas_hour' },
        },
        {
          title: '到课状态',
          dataIndex: 'type',
          width: 340,
          scopedSlots: { customRender: 'type' },
        },
        {
          // title: '扣课时',
          dataIndex: 'deduction',
          slots: { title: 'deductionTitle' },
          key: 'deduction',
          scopedSlots: { customRender: 'deduction' },
        },
        {
          title: '备注',
          dataIndex: 'remarks',
          scopedSlots: { customRender: 'remarks' },
        },
        {
          title: '操作',
          dataIndex: 'action',
          scopedSlots: { customRender: 'action' },
        },
      ],
      data: [],
      keywords: '', //临时学员搜索
      bukeKeywords: '',
      temporaryColumns: [
        {
          title: '姓名',
          dataIndex: 'name',
          ellipsis: true,
          scopedSlots: { customRender: 'name' },
        },
        {
          title: '手机号',
          dataIndex: 'phone',
          ellipsis: true,
          scopedSlots: { customRender: 'phone' },
        },
        {
          title: '报读课程',
          dataIndex: 'courseName',
          ellipsis: true,
          scopedSlots: { customRender: 'courseName' },
        },
        {
          title: '剩余课时/天数',
          dataIndex: 'remain',
          ellipsis: true,
          scopedSlots: { customRender: 'remain' },
        },
      ],
      loadData:[],
      pageNo:1,
      total:10,
      loading:false,
      // loadData: (parameter) => {
      //   return addLinshiStudentList(
      //      {
      //       keywords: this.keywords || undefined,
      //       schedules_id: this.form.schedules_id,
      //       start_time: moment(this.form.class_start_time).format('HH:mm'),
      //       end_time: moment(this.form.class_end_time).format('HH:mm'),
      //       attend_class_day: moment(this.form.attend_class_day).format('YYYY-MM-DD'),
      //     },
      //     Number(this.$route.query.class_id)
      //   )
      //     .then((res) => {
      //       return res
      //     })
      //     .catch((err) => {
      //       this.$message.error(err.data.message || '获取临时学员失败')
      //     })
      // },
      bukeColumns: [
        {
          title: '学员姓名',
          dataIndex: 'name',
          ellipsis: true,
          scopedSlots: { customRender: 'name' },
          // finish_time
        },
        {
          title: '班级名称',
          dataIndex: 'className',
          ellipsis: true,
          width: 200,
          scopedSlots: { customRender: 'className' },
        },
        {
          title: '上课时间',
          dataIndex: 'classTime',
          width: 200,
          scopedSlots: { customRender: 'classTime' },
        },
        {
          title: '上课老师',
          dataIndex: 'teachers',
          ellipsis: true,
          width: 200,
          customRendar(text) {
            return text.length > 0 ? text.join(',') : '-'
          },
        },
        {
          title: '缺课状态',
          dataIndex: 'comeType',
          scopedSlots: { customRender: 'comeType' },
        },
        {
          title: '消耗课程',
          dataIndex: 'costCourse',
          ellipsis: true,
          scopedSlots: { customRender: 'costCourse' },
        },
        {
          title: '应扣课时',
          dataIndex: 'shouldClassTime',
          ellipsis: true,
          scopedSlots: { customRender: 'shouldClassTime' },
        },
      ],
      
      bukeData: (parameter) => {
        return missClassStudentsList(Object.assign(parameter, 
          {
              keywords: this.bukeKeywords,
              start_class_time: moment(this.form.class_start_time).format('HH:mm'),
              end_class_time: moment(this.form.class_end_time).format('HH:mm'),
              attend_class_day: moment(this.form.attend_class_day).format('YYYY-MM-DD'),
          }
        ),Number(this.$route.query.class_id)).then((res) => {
          let param = JSON.parse(JSON.stringify(res))
            param.data.forEach((val) => {
              val.inputType = false
            })
          return param
        }) .catch((err) => {
            this.$message.error(err.data.message || '获取数据失败，请刷新页面或稍后再试')
          })
      },
      showStudent: false,
      showBukeStudent: false,
      selectedRowKeys: [],
      selectedRows: [],
      selectedBukeRowKeys: [],
      selectedBukeRows: [],
    }
  },
  created() {
    this.getCourseSet()
    this.spinning = true
    this.nowRouteTitle = this.$route.meta.title
    teacherList({ pageSize: 999999, school_id: this.$store.state.user.school }).then((res) => {
      this.teacherList = res.data
    })
    if (Number(this.$route.query.class_id) == 0) {
      this.is_1v1 = true
      lessonInfo({
        id: Number(this.$route.query.is1v1),
        type: this.$route.query.type,
        start_time: this.$route.query.time,
      })
        .then((res) => {
          this.form.attend_class_day = moment(res.start_time)
          this.form.course_name = res.course
          this.form.class_start_time = moment(res.class_start_time, 'HH:mm')
          this.form.class_end_time = moment(res.class_end_time, 'HH:mm')
          this.form.classroom_id = Number(res.classroom_id) || null
          this.form.content = res.content
          this.form.course_id = res.course_config.id
          this.form.teaching_hours = res.class_hour
          this.form.teacher_ids = res.teacher_ids
          // structures_id
          if (res.course_config && res.course_config.leave_cut_hour == 2) {
            this.qingjia = true
          } else {
            this.qingjia = false
          }
          if (res.course_config && res.course_config.no_come_cut_hour == 2) {
            this.weidao = true
          } else {
            this.weidao = false
          }
          this.spinning = false
        })
        .catch((err) => {
          this.spinning = false
          this.$message.error(err.data.message || '加载失败')
        })
        .finally(() => {
          this.getSelect()
        })
    } else {
      classInfo(Number(this.$route.query.class_id))
        .then((res) => {
          let params = JSON.parse(JSON.stringify(res))
          this.no_come_cut_hour = res.course.no_come_cut_hour
          if (Number(this.$route.query.schedules_id)) {
            this.form.attend_class_day = moment(this.$route.query.date)
            if (this.$route.query.classStartTime && this.$route.query.classEndTime) {
              this.form.class_start_time = moment(this.$route.query.classStartTime, 'HH:mm')
              this.form.class_end_time = moment(this.$route.query.classEndTime, 'HH:mm')
            } else {
              this.form.class_start_time = undefined
              this.form.class_end_time = undefined
            }
            this.form.schedules_id = Number(this.$route.query.schedules_id)
            this.form.teacher_ids = this.$route.query.teacher
            this.form.content = this.$route.query.content
            this.form.classroom_id = Number(this.$route.query.classroom) || null
            this.form.teaching_hours = params.teaching_hours
            this.form.course_name = params.course_name
            this.form.course_id = params.course_id
            this.form.structures = params.structures
          } else {
            this.form = params
            this.form.classroom_id = null
            this.form.attend_class_day = moment()
          }
          if (params.course && params.course.leave_cut_hour == 2) {
            this.qingjia = true
          } else {
            this.qingjia = false
          }
          if (params.course && params.course.no_come_cut_hour == 2) {
            this.weidao = true
          } else {
            this.weidao = false
          }
          if (params.type == 1) {
            this.is_1v1 = true
          }
          this.spinning = false
        })
        .catch((err) => {
          this.spinning = false
          this.$message.error(err.data.message || '加载失败')
        })
        .finally(() => {
          this.getSelect()
          this.getTemporaryStudent()
        })
    }
  },
  methods: {
    //获取课程配置
    getCourseSet() {
      getCourseInfo({
        school_id: this.$store.state.user.school,
        key: 'course_setting',
      })
        .then((res) => {
          if (res.value && JSON.stringify(res.value) != '{}') {
            this.courseCalidity = res.value.valid_time
          } else {
          }
        })
        .catch((err) => {
          // this.loading = false
          this.$message.error(err.data.message || '加载失败')
        })
    },
    changeDate() {
      this.getSelect()
      this.$forceUpdate()
    },
    disabledHours() {
      let hour = Number(moment(this.form.class_start_time).format('HH'))
      let data = []
      for (let i = 0; i < hour; i++) {
        data.push(i)
      }
      return data
    },
    disabledMinutes() {
      let hour = Number(moment(this.form.class_start_time).format('HH'))
      let endHour = Number(moment(this.form.class_end_time).format('HH'))
      let minutes = Number(moment(this.form.class_start_time).format('mm'))
      let data = []
      if (endHour > hour) {
      } else {
        for (let i = 0; i < minutes; i++) {
          data.push(i)
        }
      }

      return data
    },
    //补课学员
    addBukeStudentToData() {
      getHiddenStudentInfo({
        school_id: this.$store.state.user.school,
        key: 'hide_student',
      }).then((res) => {
        if (res.value.default_no_arrive_state) {
          this.selectedBukeRows.forEach((val) => {
            val.remarks = undefined
            val.student_id = val.student.id
            val.name = val.student.name
            val.main_phone = val.student.main_phone
            val.call_student_id = val.id
            val.student_type = val.student_type
            val.hour_due_time = val.hour_due_time
            if (
              (val.deductible && val.deductible.type == 'refuse') ||
              (val.deductible && val.deductible.type == 'refuse') ||
              (val.deductible && val.deductible.type == 'super') ||
              (val.pivot_id && +Number(val.student_type) == 3)
            ) {
              val.teaching_hours = 0
            } else {
              // val.teaching_hours = this.weidao ? 0 : this.form.teaching_hours
              val.teaching_hours =
                Number(val.class_hour - (val.deduction + val.go_beyond)) >= 0
                  ? Number(val.class_hour - (val.deduction + val.go_beyond))
                  : 0
            }

            if (val.clock_type) {
              val.type = val.clock_type
              if (val.clock_type == 4 && this.no_come_cut_hour == 2) {
                val.teaching_hours = 0
              }
            } else {
              if (this.no_come_cut_hour == 2) {
                val.teaching_hours = 0
              }
              val.type = 4
            }
            val.surplus_clas_hour = val.surplus_clas_hour
            let arr = []
            this.data.forEach((item) => {
              if (arr.indexOf(item.student_id) == -1) {
                arr.push(item.student_id)
              }
            })
            if (arr.indexOf(val.student_id) == -1) {
              this.count.noCome++
              this.data.push(val)
            }
            this.changeType()
          })
        } else {
          this.selectedBukeRows.forEach((val) => {
            val.remarks = undefined
            val.student_id = val.student.id
            val.name = val.student.name
            val.main_phone = val.student.main_phone
            val.call_student_id = val.id
            val.student_type = val.student_type
            val.hour_due_time = val.hour_due_time
            if (
              (val.deductible && val.deductible.type == 'refuse') ||
              (val.deductible && val.deductible.type == 'refuse') ||
              (val.deductible && val.deductible.type == 'super') ||
              (val.pivot_id && +Number(val.student_type) == 3)
            ) {
              val.teaching_hours = 0
            } else {
              // val.teaching_hours = this.weidao ? 0 : this.form.teaching_hours
              val.teaching_hours =
                Number(val.class_hour - (val.deduction + val.go_beyond)) >= 0
                  ? Number(val.class_hour - (val.deduction + val.go_beyond))
                  : 0
            }
            if (val.clock_type) {
              val.type = val.clock_type
              if (val.clock_type == 4 && this.no_come_cut_hour == 2) {
                val.teaching_hours = 0
              }
            } else {
              val.type = 1
            }
            val.surplus_clas_hour = val.surplus_clas_hour
            let arr = []
            this.data.forEach((item) => {
              if (arr.indexOf(item.student_id) == -1) {
                arr.push(item.student_id)
              }
            })
            if (arr.indexOf(val.student_id) == -1) {
              this.count.come++
              this.data.push(val)
            }
            this.changeType()
          })
        }
      })
      this.showBukeStudent = false
    },
    changePage(page, pageSize){
      console.log(page,pageSize);
      this.pageNo=page
      this.getlsData(pageSize)
    },
    getlsData(pageSize=10){
      this.loading=true
        addLinshiStudentList(
           {
            keywords: this.keywords || undefined,
            schedules_id: this.form.schedules_id,
            start_time: moment(this.form.class_start_time).format('HH:mm'),
            end_time: moment(this.form.class_end_time).format('HH:mm'),
            attend_class_day: moment(this.form.attend_class_day).format('YYYY-MM-DD'),
            pageSize,
            pageNo:this.pageNo
          },
          Number(this.$route.query.class_id)
        )
          .then((res) => {
           this.loadData=res.data
           this.total=res.meta.pagination.total
          })
          .catch((err) => {
            this.$message.error(err.data.message || '获取临时学员失败')
          }).finally(()=>{
            this.loading=false
          })
    },
    openLs(){
      this.pageNo=1
      this.keywords=undefined
      this.showStudent = true
   /*    this.selectedRowKeys = []
      this.selectedRows = [] */
      this.getlsData()
    },
    //获取临时学员
    getTemporaryStudent() {
      if (this.$refs.table) {
        // this.$refs.table.refresh()
        this.getlsData()
      }
      addLinshiStudentList(
        {
          keywords: this.keywords || undefined,
          schedules_id: this.form.schedules_id,
          pageSize: 9999999999,
        },
        Number(this.$route.query.class_id)
      ).then((res) => {
        this.temporaryData = res
      })
    },
    getMonday(date) {
      //获取周一日期
      let dd = new Date(date)
      let week = dd.getDay()
      let minus = week ? week - 1 : 6
      dd.setDate(dd.getDate() - minus)
      let y = dd.getFullYear()
      let m = dd.getMonth() + 1
      let d = dd.getDate()
      return y + '-' + m + '-' + d
    },
    getSelect() {
      classroomList({ pageSize: 999999, school_id: this.$store.state.user.school }).then((res) => {
        this.classRoomSelect = res.data
      })
      if (this.$route.query.schedules_id) {
        defaultCallStudent(
          {
            pageSize: 999999,
            attend_class_day: moment(this.form.attend_class_day).format('YYYY-MM-DD'),
            start_time: moment(this.form.class_start_time).format('HH:mm'),
            end_time: moment(this.form.class_end_time).format('HH:mm'),
          },
          Number(this.$route.query.schedules_id)
        ).then((res) => {
          let params = JSON.parse(JSON.stringify(res.data))
          let arr = 0
          params.forEach((d) => {
            d.type = 1
            d.remarks = ''
            d.student_id = d.id
            d.teaching_hours = this.form.teaching_hours

            if (d.deductible && d.deductible.type !== 'refuse') {
              arr = arr + 1
            }
            if (d.clock_type) {
              d.type = d.clock_type
              if (d.clock_type == 4 && this.no_come_cut_hour == 2) {
                d.teaching_hours = 0
              }
            }
          })
          getHiddenStudentInfo({
            school_id: this.$store.state.user.school,
            key: 'hide_student',
          }).then((res) => {
            if (res.value.default_no_arrive_state) {
              params.forEach((item) => {
                if (item.clock_type) {
                  item.type = item.clock_type
                  if (item.clock_type == 4 && this.no_come_cut_hour == 2) {
                    item.teaching_hours = 0
                  }
                } else {
                  if (this.no_come_cut_hour == 2) {
                    item.teaching_hours = 0
                  }
                  item.type = 4
                }
              })
              arr = 0
              this.count.noCome = params.length
            }

            this.data = params
            this.changeType()
            // this.count.come = arr
          })
        })
      } else if (this.$route.query.is1v1) {
        defaultCallStudent(
          {
            pageSize: 999999,
            attend_class_day: moment(this.form.attend_class_day).format('YYYY-MM-DD'),
            api_type: 'call',
            start_time: moment(this.form.class_start_time).format('HH:mm'),
            end_time: moment(this.form.class_end_time).format('HH:mm'),
          },
          Number(this.$route.query.is1v1)
        ).then((res) => {
          let params = JSON.parse(JSON.stringify(res.data))
          let arr = 0
          params.forEach((d) => {
            d.type = 1
            d.remarks = ''
            d.student_id = d.id
            d.teaching_hours = this.form.teaching_hours
            if (d.deductible && d.deductible.type !== 'refuse') {
              arr = arr + 1
            }
            if (d.clock_type) {
              d.type = d.clock_type
              if (d.clock_type == 4 && this.no_come_cut_hour == 2) {
                d.teaching_hours = 0
              }
            }
          })
          getHiddenStudentInfo({
            school_id: this.$store.state.user.school,
            key: 'hide_student',
          }).then((res) => {
            if (res.value.default_no_arrive_state) {
              params.forEach((item) => {
                if (item.clock_type) {
                  item.type = item.clock_type
                  if (item.clock_type == 4 && this.no_come_cut_hour == 2) {
                    item.teaching_hours = 0
                  }
                } else {
                  if (this.no_come_cut_hour == 2) {
                    item.teaching_hours = 0
                  }
                  item.type = 4
                }
              })
              arr = 0
              this.count.noCome = params.length
            }
            this.data = params
            this.count.come = arr
            this.changeType()
          })
        })
      } else {
        studentInClassAwait(
          {
            pageSize: 999999,
            attend_class_day: moment(this.form.attend_class_day).format('YYYY-MM-DD'),
            api_type: 'call',
            start_time: moment(this.form.class_start_time).format('HH:mm'),
            end_time: moment(this.form.class_end_time).format('HH:mm'),
          },
          Number(this.$route.query.class_id)
        ).then((res) => {
          let params = JSON.parse(JSON.stringify(res))
          let arr = 0
          if (params.length > 0) {
            params.forEach((val) => {
              val.type = 1
              val.remarks = ''
              val.student_id = val.id
              if (!val.student_type) {
                val.student_type = 0
              }
              if (val.deductible && val.deductible.type !== 'refuse') {
                arr = arr + 1
              }

              val.teaching_hours = this.form.teaching_hours
              if (val.clock_type) {
                val.type = val.clock_type
                if (val.clock_type == 4 && this.no_come_cut_hour == 2) {
                  val.teaching_hours = 0
                }
              }
            })
            getHiddenStudentInfo({
              school_id: this.$store.state.user.school,
              key: 'hide_student',
            }).then((res) => {
              if (res.value.default_no_arrive_state) {
                params.forEach((item) => {
                  if (item.clock_type) {
                    item.type = item.clock_type
                    if (item.clock_type == 4 && this.no_come_cut_hour == 2) {
                      item.teaching_hours = 0
                    }
                  } else {
                    if (this.no_come_cut_hour == 2) {
                      item.teaching_hours = 0
                    }
                    item.type = 4
                  }
                })
                arr = 0
                this.count.noCome = params.length
              }
              this.data = params
              this.count.come = arr
              this.changeType()
            })
          }
        })
      }
    },
    showChild(e) {
      if (e == 'classTime') {
        this.$refs.classTime.showModal()
      }
    },
    showClassroom() {
      this.$refs.classRoom.showModal()
    },
    back() {
      this.$router.go(-1)
    },
    reduceStudent(e) {
      let that = this
      this.$confirm({
        title: '提示',
        content: '确定移出学生：' + e.name + '吗?',
        okText: '确定',
        okType: 'primary',
        cancelText: '取消',
        onOk() {
          that.data.forEach((val, index) => {
            if (val.id == e.id) {
              that.data.splice(index, 1)
              that.changeType()
            }
          })
        },
        onCancel() {
          console.log('Cancel')
        },
      })
    },
    changeType(e, index) {
      if (e) {
        if (e.type == 3 && this.qingjia) {
          e.teaching_hours = 0
        } else if (e.type == 4 && this.weidao) {
          e.teaching_hours = 0
        } else {
          e.teaching_hours = this.form.teaching_hours
        }
        this.data.splice(index, 1, e)
      }
      let count = {
        come: 0,
        late: 0,
        leave: 0,
        noCome: 0,
      }
      this.data.forEach((val) => {
        if (val.deductible && val.deductible.type !== 'refuse') {
          val.type == 1
            ? count.come++
            : val.type == 2
            ? count.late++
            : val.type == 3
            ? count.leave++
            : val.type == 4
            ? count.noCome++
            : ''
        }
      })
      this.count = count
    },
    submit(e) {
      if (this.form.attend_class_day) {
        if (this.form.class_start_time) {
          if (this.form.class_end_time) {
            if (this.form.teacher_ids.length > 0) {
              if (this.form.teaching_hours) {
                let params = JSON.parse(JSON.stringify(this.form))
                params.class_hour = params.teaching_hours
                params.student_arr = this.data
                params.date = this.getMonday(params.attend_class_day)
                params.start_time = this.$route.query.date
                let data = {
                  course_id: params.course_id,
                  class_hour: params.teaching_hours,
                  student_arr: [],
                  structures_id: params.structures.id,
                }
                params.student_arr.forEach((val) => {
                  if (val.call_student_id) {
                    val.student_type = 4
                  }
                  if (val.deductible && val.deductible.type !== 'refuse') {
                    if (val.student_type == 3) {
                      val.cut_hour = 0
                    } else if (val.surplus_clas_hour && val.surplus_clas_hour.type == 'day') {
                      val.cut_hour = 0
                    } else {
                      val.cut_hour = val.teaching_hours
                    }
                    data.student_arr.push(val)
                  }
                })
                if (data.student_arr.length == 0) {
                  this.$message.warning('请至少给一位可点学员点名')
                  return
                }
                params.class_start_time = moment(params.class_start_time).format('HH:mm')
                params.class_end_time = moment(params.class_end_time).format('HH:mm')
                params.school_id = this.$store.state.user.school
                params.attend_class_day = moment(params.attend_class_day).format('YYYY-MM-DD')
                params.class_id = Number(this.$route.query.class_id)
                ruleData(data)
                  .then((res) => {
                    if (res.length > 0) {
                      let str = ''
                      res.forEach((val, index) => {
                        if ((index = val.length - 1)) {
                          str = str + val
                        } else {
                          str = str + val + ','
                        }
                      })
                      let that = this
                      this.$confirm({
                        title: '超上提醒',
                        content: '学员: ' + str + '本次课将超上，是否继续为他们点名？',
                        okText: '确定',
                        okType: 'primary',
                        cancelText: '取消',
                        onOk() {
                          that.$confirm({
                            title: '提示',
                            content:
                              '本次点名到课' +
                              that.count.come +
                              '人,迟到' +
                              that.count.late +
                              '人,请假' +
                              that.count.leave +
                              '人,未到' +
                              that.count.noCome +
                              '人,是否确认点名?',
                            okText: '确定',
                            okType: 'primary',
                            cancelText: '取消',
                            onOk() {
                              makeToken()
                                .then((res) => {
                                  params.token = res
                                  createRollCall(params)
                                    .then((val) => {
                                      that.back()
                                    })
                                    .catch((err) => {
                                      that.$message.error(err.data.message || '点名失败')
                                    })
                                })
                                .catch((errs) => {
                                  that.$message.error(errs.data.message || '获取失败')
                                })
                            },
                            onCancel() {
                              console.log('Cancel')
                            },
                          })
                        },
                        onCancel() {
                          console.log('Cancel')
                        },
                      })
                    } else {
                      let that = this
                      this.$confirm({
                        title: '提示',
                        content:
                          '本次点名到课' +
                          that.count.come +
                          '人,迟到' +
                          that.count.late +
                          '人,请假' +
                          that.count.leave +
                          '人,未到' +
                          that.count.noCome +
                          '人,是否确认点名?',
                        okText: '确定',
                        okType: 'primary',
                        cancelText: '取消',
                        onOk() {
                          makeToken()
                            .then((val) => {
                              params.token = val
                              createRollCall(params)
                                .then((res) => {
                                  that.back()
                                })
                                .catch((err) => {
                                  that.$message.error(err.data.message || '点名失败')
                                })
                            })
                            .catch((errs) => {
                              that.$message.error(errs.data.message || '获取失败')
                            })
                        },
                        onCancel() {
                          console.log('Cancel')
                        },
                      })
                    }
                  })
                  .catch((err) => {
                    this.$message.error(err.data.message || '错误')
                  })
              } else {
                this.$message.warning('请输入授课课时')
                return
              }
            } else {
              this.$message.warning('请选择上课教师')
              return
            }
          } else {
            this.$message.warning('请选择上课结束时间')
          }
        } else {
          this.$message.warning('请选择上课时间')
          return
        }
      } else {
        this.$message.warning('请选择上课日期')
        return
      }
    },
    onSelectChange(selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
    },
    onSelectBukeChange(selectedRowKeys, selectedRows) {
      this.selectedBukeRowKeys = selectedRowKeys
      this.selectedBukeRows = selectedRows
    },
    addStudentToData(type) {
      if (type == 'linshi') {
        getHiddenStudentInfo({
          school_id: this.$store.state.user.school,
          key: 'hide_student',
        }).then((res) => {
         
          if (res.value.default_no_arrive_state) {
            this.selectedRows.forEach((val) => {
              val.type = 4
              val.remarks = undefined
              val.student_id = val.id
              val.student_type = 1
              val.teaching_hours = this.form.teaching_hours
              val.hour_due_time = val.hour_due_time
              if (val.clock_type) {
                val.type = val.clock_type
                if (val.clock_type == 4 && this.no_come_cut_hour == 2) {
                  val.teaching_hours = 0
                }
              } else {
                if (this.no_come_cut_hour == 2) {
                  val.teaching_hours = 0
                }
              }
              let arr = []
              this.data.forEach((item) => {
                if (arr.indexOf(item.student_id) == -1) {
                  arr.push(item.student_id)
                }
              })
              if (arr.indexOf(val.student_id) == -1) {
                this.count.noCome++
                this.data.push(val)
              }
              this.changeType()
            })
          } else {
            this.selectedRows.forEach((val) => {
              val.type = 1
              val.remarks = undefined
              val.student_id = val.id
              val.student_type = 1
              val.teaching_hours = this.form.teaching_hours
              val.hour_due_time = val.hour_due_time
              if (val.clock_type) {
                val.type = val.clock_type
                if (val.clock_type == 4 && this.no_come_cut_hour == 2) {
                  val.teaching_hours = 0
                }
              }
              let arr = []
              this.data.forEach((item) => {
                if (arr.indexOf(item.student_id) == -1) {
                  arr.push(item.student_id)
                }
              })
              if (arr.indexOf(val.student_id) == -1) {
                this.count.come++
                this.data.push(val)
              }
              this.changeType()
            })
          }
        })
        // console.log(this.data);
        this.showStudent = false
         
      }
    },
    moment,
    changeEndTime(date, dateString) {
      if (this.form.class_end_time) {
        if (moment(this.form.class_start_time).valueOf() > moment(this.form.class_end_time).valueOf()) {
          this.$message.warning('结束时间不能大于开始时间')
          this.form.class_end_time = undefined
          this.$forceUpdate()
          return
        }
        // let startHour = Number(moment(this.form.class_start_time).format('HH'))
        // let endHour = Number(moment(this.form.class_end_time).format('HH'))
        // let startMin = Number(moment(this.form.class_start_time).format('mm'))
        // let endMin = Number(moment(this.form.class_end_time).format('mm'))
      }
      this.$forceUpdate()
    },
  },
  watch: {
    showBukeStudent(val) {
      if (val == true) {
        this.$nextTick(() => {
          this.$refs.bukeTable.refresh()
        })
      }
    },
  },
}
</script>

<style lang="less" scoped>
.btns {
  margin-bottom: 20px;
}
.footer {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 100%;
  text-align: right;
  z-index: 1;
}
.marginRight {
  margin-right: 20px;
  span {
    margin: 0 10px;
  }
}
.orderNameVueClass_time {
  width: 100%;
  height: 48px;
}
</style>
<style lang="less">
.orderNameVueClass_time > .ant-form-item-label::before {
  display: inline-block;
  color: #f5222d;
  margin-right: 4px;
  font-size: 14px;
  font-family: SimSun, sans-serif;
  line-height: 1;
  content: '*';
}
</style>